<template>
  <Page :total="prop.paras.total" :model-value="prop.paras.page" :page-size="prop.paras.size" :page-size-opts="[10, 15, 20, 50,500,1000]" show-sizer
    show-elevator show-total style="padding: 10px 0 0 10px" @on-change="page_change" @on-page-size-change="size_change">
  </Page>
</template>
  
<script setup>
const emit = defineEmits(["toPage", "toSize"]);
const prop = defineProps({
  paras: { total: 0, page: 1, size: 15 }
});

const page_change = (p) => {
  prop.paras.page = p;
  emit("toPage", prop.paras.page, prop.paras.size);
};
const size_change = (s) => {
  prop.paras.size = s;
  emit("toSize", prop.paras.page, prop.paras.size);
};
</script>
  
<style></style>
  